import React, {PureComponent} from 'react'
import { Icon } from 'antd'
import {RemmendWrapper, Collect, Name, Word} from '../style.js'
import { connect } from 'react-redux'
import { Link } from 'react-router-dom'
class RemmendColloct extends PureComponent{
    render(){
             const { list } = this.props;
        return(
          <div>
             <RemmendWrapper>
                   {
                       list.map((items) => {
                      return(
                       <Link to = {'/remmend'}>
                         <Collect key = { items.get('id') }>
                         <img alt= '' className = 'collect-img' src ={items.get('urlImg')} />
                         <Name>{items.get('title')}</Name> 
                         </Collect>
                       </Link>
                      )  
                    })
                    }
               <Word>更多热门专题
               <Icon type="right" theme="outlined" style = {{color:'#787878', fontSize:'14px'}} />
               </Word>
           </RemmendWrapper>
        
          </div>
           
        )
    }
}
const mapState = (state) => {
  return{
    list: state.get('home').get('remmendList')
  }
}
export default connect(mapState,null)(RemmendColloct);